import vue from '@vitejs/plugin-vue'
import VueJsx from '@vitejs/plugin-vue-jsx'
import path from 'path'
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { VantResolver } from '@vant/auto-import-resolver'
import tailwindcss from '@tailwindcss/vite'
import { viteMockServe } from 'vite-plugin-mock'
import { visualizer } from 'rollup-plugin-visualizer'
import viteImagemin from 'vite-plugin-imagemin'
// @ts-ignore
import EslintPlugin from 'vite-plugin-eslint'

export default {
  lintOnSave: false,
  base: './',
  cacheDir: './node_modules_modules/.vite',
  plugins: [
    vue(),
    VueJsx(),
    tailwindcss(),
    AutoImport({
      resolvers: [VantResolver()],
    }),
    Components({
      resolvers: [VantResolver()],
    }),
    EslintPlugin({
      cache: false,
      failOnWarning: false,
      failOnError: false,
      include: ['src/**/*.vue', 'src/**/*.ts', 'src/**/*.tsx'], // 检查的文件
    }),
    viteMockServe({
      mockPath: './mock',
      enable: true,
      watchFiles: true,
      logger: true,
    }),
    visualizer({
      open: true, // 自动打开报告
      gzipSize: true, // 显示gzip压缩后的大小
      brotliSize: true, // 显示brotli压缩后的大小
    }),
    viteImagemin({
      gifsicle: { optimizationLevel: 3 }, // gif压缩
      optipng: { optimizationLevel: 2 }, // png压缩
      mozjpeg: { quality: 80 }, // jpg压缩
      pngquant: { quality: [0.6, 0.8] },
    }),
  ],
  build: {
    minify: 'esbuild',
    esbuild: {
      dropconsole: true,
      dropdebugger: true,
    },
    rollupOptions: {
      output: {
        // 拆分代码块
        manualChunks: {
          // 拆分vue相关依赖打包为单独chunk
          vue: ['vue', 'vue-router'],
          // 拆分工具库
          // utils: ['lodash-es'],
          // 拆分UI组件库
          ui: ['vant', 'element-plus'],
        },
      },
    },
  },
  css: {
    //  preprocessorOptions: {
    //   scss: {
    //     additionalData: '@import "@/styles/variables.scss";',
    //     javascriptEnabled: true
    //   }
    // },
  },
  server: {
    port: 8888,
    proxy: {
      '/api': {
        changeOrigin: true,
        rewrite: (path: any) => path.replace(/^\/api/, ''),
        // mock代理目标地址
        target: 'http://localhost:8888/api',
        ws: true,
      },
    },
    host: '0.0.0.0',
  },
  resolve: {
    alias: {
      '@': path.resolve(__dirname, 'src'),
    },
  },
  optimizeDeps: {
    include: ['vant', 'vue', 'vue-router', 'axios'],
  },
}
